
<template>
<div class="app-container">
  <el-form ref="form" :inline="true" :model="search" label-width="100">
    <el-form-item label="订单名称">
      <el-input v-model="search.nickname"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="onSubmit">查询</el-button>
      <el-button type="primary" @click="clearForm">重置</el-button>
    </el-form-item>
  </el-form>

  <el-table
    :data="tableData"
    style="width: 100%">

    <el-table-column
      prop="nickname"
      label="会员昵称"
    >
    </el-table-column>

    <el-table-column
      prop="content"
      label="评论内容"
    >
    </el-table-column>
    <el-table-column
      prop="eduCreate"
      label="创建时间"
    >
    </el-table-column>
    <el-table-column
      prop="eduModified"
      label="修改时间"
    >
    </el-table-column>
    <el-table-column label="操作">
      <template slot-scope="scope">
        <el-button @click="openDig(scope.row)" type="primary">修改</el-button>
        <el-button @click="dels(scope.row.id)" type="primary">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
  <el-pagination
    background
    :current-page="page.pageNum"
    layout="prev, pager, next"
    @current-change="handleCurrentChange"
    :page-count="page.pages">
  </el-pagination>

  <el-dialog
    title="提示"
    :visible.sync="dialogVisible"
    width="30%">
    <el-form  :inline="true" :model="saveFrom" label-width="100">
      <el-form-item label="会员昵称">
        <el-input v-model="saveFrom.nickname" readonly="readonly"></el-input>
      </el-form-item>
      <el-form-item label="评论内容">
        <el-input v-model="saveFrom.content" ></el-input>
      </el-form-item>
      <el-form-item label="创建时间(页面信息太少,加一点装饰)">
        <el-input v-model="saveFrom.eduCreate" readonly="readonly"></el-input>
      </el-form-item>
    </el-form>
    <el-button @click="dialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="saveOrupdate">确 定</el-button>
  </el-dialog>
</div>
</template>
<script >
   import comment from "../api/comment";
   import cookie from "js-cookie";

   export  default{
     layout:'menu',
     data(){
       return{
         search:{
           nickname:''
         },
         dialogVisible:false,
         page:{
           pageNum:1,
           pageSize:2,
           pages:0,
           total:0
         },
         saveFrom:{
           id:'',
           nickname:'',
           content:'',
           eduCreate:'',
           eduModified:''
         },
         tableData:[],
       }
     },
     methods:{
       getPage(){
         comment.select(this.search,this.page).then(resp=>{
           this.tableData=resp.data.records
           this.page.pageNum=resp.data.current
           this.page.pageSize=resp.data.total
           this.page.pages=resp.data.pages
         })
       },
       onSubmit(){
         this.page.pageNum=1
         this.getPage()
       },
       clearForm(){
         this.search={
           nickname:'',
         }
         this.onSubmit()
       },
       handleCurrentChange(val){
         this.page.pageNum=val
         this.getPage()
       },
       openDig(row){
          this.dialogVisible=true
          this.saveFrom.id=row.id
          this.saveFrom.nickname=row.nickname
          this.saveFrom.content=row.content
          this.saveFrom.eduCreate=row.eduCreate   //创建时间
          this.saveFrom.eduModified=row.eduModified   //修改时间
       },
       dels(id){
          this.$confirm('是否删除该条弹幕信息','提示',{
            confirmButtonText:'确定',
            cancelButtonText:'取消',
            type:'warning'
          }).then(()=>{
            comment.delById(id).then(resp=>{
              if (resp.code==20000){
                this.$message.success('删除成功！')
                this.getPage()
              }else{
                this.$message.error('删除失败！')
              }
            })
          }).catch(()=>{
            this.$message({
              type:'info',
              message:'已取消删除'
            })
          })
       },
       saveOrupdate(){
         comment.saveA(this.saveFrom).then(res=>{
           if (res.code==20000){
             this.dialogVisible=false
             this.$message.success('修改成功!')
             this.getPage()
           }
         })
       },
       getSelect(){
         var userStr=cookie.get("front_member")
         if (userStr){
           this.loginInfo=JSON.parse(userStr)
           console.log(this.loginInfo)
           this.form=this.loginInfo
         }
       },
     },
     created() {
       this.getSelect()
       this.getPage()
     }
   }
</script>
<style scoped>

</style>
